<template>
  <div class="paging-cpt-wrap">
    <el-pagination
      background
      layout="prev, pager, next"
      :total="count"
      :page-size="pageSize"
      :current-page="nowPage"
      :pager-count="5"
      :hide-on-single-page="false"
      @current-change="currentChange"
    />
  </div>
</template>

<script lang="ts" scoped>
import { defineComponent } from 'vue'
export default defineComponent({
  name: 'PagingCpt',
  props: {
    count: {
      type: Number,
      default: 0
    },
    nowPage: {
      type: Number,
      default: 1
    },
    pageSize: {
      type: Number,
      default: 10
    }
  },
  emits: {
    'current-change': (payload: any) => {
      return payload
    }
  },
  setup (props, { emit }) {
    const currentChange = (nowPage:number) => {
      emit('current-change', nowPage)
      scrollTo({ top: 0 })
    }
    return { currentChange }
  }
})
</script>

<style lang="scss" scoped>
.paging-cpt-wrap {
  display: flex;
  justify-content: center;
}
</style>
